<?php
require_once 'index1.php';
require_once 'class/admin.php';
?>
<link rel="stylesheet" href="/css/jquery-ui.css"/>
<script src="/libs/jquery-1.9.1.js"></script>
<script src="/libs/jquery-ui.js"></script>
<?php

if (isset($_SESSION['admin'])) {
    $admin = unserialize($_SESSION['admin']);
    $inital = $admin->getInitial();
    $value = $inital * 100 / 3;
    ?>
    <script>
        $(document).ready(function(){
            var effect ="clip";
            /*$("#button1").click(function(){
           show();
          $("#step1").hide(effect, 2000);
          $("#step2").show(effect, 2000);
        });
             */
            $("#button2").click(function(){
                $("#step2").hide(effect, 1000);
                $("#step3").show(effect, 1000);
            });
            $("#button3").click(function(){
                if($("#txtHint").text()=="initial roster successful"){
                   $("#step3").hide(effect, 1000); 
                }
            });
            
            $("#dutiesForm").submit(function(){
            return false;
            });
            $("#progressbar").progressbar({value:<?= $value ?>});
            $("#startDate").datepicker({ dateFormat: "yy-mm-dd" });
            $("#endDate").datepicker({ dateFormat: "yy-mm-dd" });
            
            if(<?= $inital ?>==0){
                $("#step2").hide();
                $("#step3").hide();
            }else if(<?= $inital ?>==1){
                $("#step1").hide();
                $("#step3").hide();
            }else if(<?= $inital ?>==2){
                $("#step1").hide();
                $("#step2").hide();
            }else if(<?=$inital ?>==3){
                $("#step1").hide();
                $("#step2").hide();
                $("#step3").hide();
                window.location.assign("http://localhost:8080/admin.php");
            }
        });
        
    </script>
    <script>
        function showHint()
        {
            var xmlhttp;
            var a = document.getElementById("newDBName").value;
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
                }
            }
            xmlhttp.open("POST","ajax2.php?newDBName="+a+"&tip=1",true);
            xmlhttp.send();
        }

        function CreateNewDB()
        {
            var xmlhttp;
            var a = document.getElementById("newDBName").value;
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                }
            }
            xmlhttp.open("POST","ajax2.php?newDBName="+a+"&tip=2",true);
            xmlhttp.send();
        }
                
            
        function show2(){
            if($("#txtHint").text()=="create DB successful"){
                var effect ="clip";
                $("#step1").hide(effect, 1000);
                $("#step2").show(effect, 1000);
                setTimeout(function(){window.location.reload(false);},2000);
            }
        }
         var dutyNum =0;
         //var dutyArray = new Array();
        function addDuty(){
            //tempValue = document.getElementById("duty"+dutyNum).value;
            //dutyArray.push(tempValue);
            $("#add_duty_"+dutyNum).hide();
            temp = $("#dynamic_duties");
            dutyNum = parseInt(dutyNum)+1;
            temp.append("<div id='show_duty_"+dutyNum+"'>duties Name:<input type='text' name='duty"+dutyNum+"'><button id='add_duty_"+dutyNum+"' onclick='addDuty()'>add</button></div>")
            $("#dutyNum").val(dutyNum);
        }
        function CreateDutiesArray(){
            $("#button2").click(function(){
                $.post("ajax2.php", $("#dutiesForm").serialize(), function(data){$("#txtHint").html(data)}); 
            });
            setTimeout(function(){window.location.reload(false);},2000);
            
        }
        
        function PickeStartEndDate(){
            $("#button3").click(function(){
                $.post("ajax2.php", $("#datePickerForm").serialize(), function(data){$("#txtHint").html(data)}); 
                setTimeout(function(){window.location.reload(false);},2000);
            });
            /*
            if(confirm("initial finished")){
                    
                }
                */
        }
    </script>
    <?php
    echo "<div class='logStatuebar'><span class='welcome'> welcome admin</span>";
    echo "<div class=logout><a href='logout.php?attempt'>Log Out</a></div>";
    echo "<div class='userName'>" . $admin->getEmail() . "</div></div>";
    echo "1.initial roster db name and then update db name into user sheet<br>";
    echo "2.initial duties sheet<br>";
    echo "3.initial roaster date ranges<br>";
    ?>
    <p><span id="txtHint">testing</span></p>
    <div id="step1"><form action="">
            Unique DB Name: <input type="text" id="newDBName" onkeyup="showHint()"/>
            <button type="button" id="button1" class="ui-state-default ui-corner-all" onmousedown="CreateNewDB()" onmouseout="show2()">Create</button>
        </form><br>
    </div>
    <div id="step2"><form  action="#" id="dutiesForm">
            <div id="dynamic_duties">
                <input type="hidden" name="tip" value="3">
                <input type="hidden" id="dutyNum" name="dutyNum" value ="">
                <div id="show_duty_0">
            <p>duties Name:<input type="input" name="duty0"><button id="add_duty_0" onclick ="addDuty()">add</button></p>
                </div>
            </div>
            <button type="button" id="button2" class="ui-state-default ui-corner-all" onmousedown="CreateDutiesArray()">Create</button>
        </form></div>
    <div id="step3"><form id="datePickerForm">
             <input type="hidden" name="tip" value="4">
            <p>Start Date:<input type="text" name="startDate" id="startDate"/></p>
            <p>end Date:<input type="text" name="endDate" id="endDate"/></p>
        </form>
        <button id="button3" class="ui-state-default ui-corner-all" onmousedown="PickeStartEndDate()">Choose</button>
    </div>

    <?php
} else {
    echo 'you need to login first';
    header("refresh:2; url=http://localhost:8080");
}
require_once 'index2.php';
?>